/**
* Vista asociada al contenido 
* del tab de la funcionalidad VER IMAGENES Y CAMARA
* en el aplicativo.
*/
Ext.define("entgpv11.view.details.ImageList", {
    extend: "Ext.Container",
    alias: "widget.imagelist",
    config:
    {
        type: 'vbox',
        layout: 'card'
    },
    initialize: function () {
        this.callParent(arguments);
        var imgListCarousel = {
            xtype: 'carousel',
            defaults: 
            {
                layout: 'hbox'
            },
            emptyText: "<center><div class=\"notes-list-empty-text\">Datos no encontrados</div></center>",
            //this time direction vertical
            direction: 'vertical'

        };
        var tooldCarousel = {
            xtype: 'toolbar',
            docked: 'top',
            ui: 'sub',
            title: 'Imagenes',
            items: [

                          {
                              xtype: "button",
                              iconMask: true,
                              pressed: true,
                              iconCls: 'photo1',
                              handler: this.onCameraButtonTap,
                              scope: this
                          },
                          { xtype: 'spacer' }

                   ]
        };
        this.add([

                 tooldCarousel,
                 imgListCarousel

        ]);
    },
    addContainerItems: function (_items) {
        try {
            /*
            var _items =  [{
            html: "<img src='teil1.jpg' width='320' height='60' alt='' border='0'>"
            },
            {
            html: "<img src='teil2.jpg' width='320' height='60' alt='' border='0'>"
            }];
            */
            //these images can be found inside resources/photos/{category_name}/*
            var formPanel = this.down('carousel');
            var horizontalCarousels = [];
            if (_items!=null) {

                var categories = [], iCount = 0, h = 0,datoItem="", 
                itemsCountPerCategory = 10,
                items, i, j, ln, h, category;

                if (_items.length != 0)
                    iCount = new Number(_items.length / itemsCountPerCategory);
                if (iCount < 0)
                    iCount = 1;
                iCount.toFixed();
                for (i = 0; i < iCount; i++) {
                    categories.push('categorie_' + i);
                }
                //now we loop through each of the categories
                for (i = 0, ln = categories.length; i < ln; i++) {
                    items = [];

                    for (j = 1; j <= itemsCountPerCategory; j++) {
                        if (h < _items.length) {
                            datoItem =_items[h];
                            datoItem.html = Ext.String.format(datoItem.html, window.innerWidth, window.innerHeight);
                            items.push(datoItem);
                            h = h + 1;
                        }
                        else {
                            break;
                        }
                    }

                    //now we add the new horizontal carousel for this category
                    horizontalCarousels.push({
                        xtype: 'carousel',
                        activeItem:0,
                        //the direction is horizontal
                        direction: 'horizontal',
                     
                        //we turn on direction lock so you cannot scroll diagonally
                        directionLock: true,

                        //and give it the items array
                        items: items
                    });
                }
                formPanel.removeAll(true, false);
                formPanel.setItems(horizontalCarousels);

            }
            else {
                
                var _itemsNews = [{
                    html: "<center><div class=\"notes-list-empty-text\">Datos no encontrados</div></center>"
                }];
                formPanel.removeAll(true, false);
                formPanel.setItems(_itemsNews);
            }
          
        }
        catch (ex) {
            APP_GLOBAL.SetLog('addItems::' + ex);
        }
    },
    addItem: function (_dato) {
        try {
            var formPanel = this.down('carousel');
            var _itemsNews = formPanel.getItems();
            var item = { html: "<img id='imagen" + _itemsNews.length + "' alt='Base64 string " + _itemsNews.length + "' src='data:image/png;base64," + _dato + "'  height='" + window.innerHeight + "' width='" + window.innerWidth + "'/>" };
            formPanel.insert(0, item);
            formPanel.setActiveItem(0);
        }
        catch (ex) {
            APP_GLOBAL.SetLog('addItem::' + ex);
        }
    },
    onCameraButtonTap: function () {
        this.fireEvent("cameraButtonTapCommand", this);

    }


});

